<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="css/浮动Bug.css" />
	</head>
	<body>
		<!-- 浮动  元素一旦浮动起来，页面由元素之间嵌套形成
		     floot属性一定会浮动Bug，主要Bug两个
			 1.浮动塌陷:具备元素嵌套，父元素没有指定高度,子元素浮动
			   解决方案：①找到塌陷父级元素，指定高度  经验
			            ②找到塌陷父级元素，指定溢出隐藏，子元素当高度做隐藏  推荐
			 
			 2.浮动卡住：父级元素宽度不够，某个子元素【高度超过其他元素】
			   解决方案：①找到父级元素，看需求加宽【横向显示】，看需求加高【纵向显示】
			            ②找到卡住元素清除浮动
		 -->
		 <div id="father">
		 	<div class="d1">1</div>
		 	<div class="d1">2</div>
		 	<div class="d1">3</div>
		 	<div class="d1">4</div>
		 	<div class="d1">5</div>
		 </div>
	</body>
</html>